<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ page import="com.semanticvoid.lifelogger.configuration.Constants" %>
<%@ page import="com.semanticvoid.lifelogger.db.DbInterface" %>
<%@ page import="com.semanticvoid.lifelogger.metrics.plot.MetricPlotter" %>


<%
    //int type = Integer.valueOf((String) request.getAttribute("type"));
    
    String from = (String) session.getAttribute("fdate");
    String to = (String) session.getAttribute("tdate");
%>

<div>
    <div><canvas id="timeLinegraph" height="150" width="350"></canvas></div>
</div>

<script type="text/javascript">
        var layout = new Layout("bar");

	layout.addDataset("d1", [<%= MetricPlotter.getTimeLineDistributionForPeriodAsJSString(Constants.ITEM_TYPE_FOR_READ_BLOG, from, to) %>]);
	
	layout.evaluate();

var options = {
   "colorScheme": PlotKit.Base.palette(PlotKit.Base.baseColors()[0]),
   "xTicks": [{v:0, label:"00"}, 
          {v:1, label:"01"}, 
          {v:2, label:"02"},
          {v:3, label:"03"},
	  {v:4, label:"04"},
	{v:5, label:"05"},
	{v:6, label:"06"},
	{v:7, label:"07"},
	{v:8, label:"08"},
	{v:9, label:"09"},
	{v:10, label:"10"},
	{v:11, label:"11"},
	{v:12, label:"12"},
	{v:13, label:"13"},
	{v:14, label:"14"},
	{v:15, label:"15"},
	{v:16, label:"16"},
	{v:17, label:"17"},
	{v:18, label:"18"},
	{v:19, label:"19"},
	{v:20, label:"20"},
	{v:21, label:"21"},
	{v:22, label:"22"},
	{v:23, label:"23"},
	{v:24, label:"00"},
   ],
   "drawYAxis": true
};


        
var chart = new SweetCanvasRenderer($("timeLinegraph"), layout, options);
        chart.render();

    </script>